<template>
  <div>
    <div class="title">
      <van-image
        round
        width="5rem"
        height="5rem"
        src="https://img01.yzcdn.cn/vant/cat.jpeg"
      />
      <p>游客</p>
      <button @click="$router.push('/login')">去登录</button>
    </div>
    <van-grid :column-num="3" :border="false" :clickable="true">
      <van-grid-item icon="like-o" text="我的收藏" />
      <van-grid-item icon="wap-home-o" text="我的出租" />
      <van-grid-item icon="underway-o" text="看房记录" />
      <van-grid-item icon="shop-o" text="成为房主" />
      <van-grid-item icon="user-o" text="个人资料" />
      <van-grid-item icon="service-o" text="联系我们" />
    </van-grid>
  </div>
</template>

<script>
export default {
  name: 'MyUser',
  components: {},
  props: {},
  data() {
    return {}
  },
  computed: {},
  watch: {},
  created() {},
  methods: {}
}
</script>

<style scoped lang="less">
.title {
  margin: 50px auto;
  width: 300px;
  height: 250px;
  text-align: center;
  box-shadow: 10px 10px 20px 1px pink;
  p {
    padding: 50px 0;
  }
  button {
    width: 100px;
    height: 30px;
    color: aliceblue;
    border-radius: 8px;
    background-color: #21b97a;
  }
}
</style>
